<template>
	<view class="bullet-frame" v-show="showBulletFrame" @click="goAnalysis()">
		<text class="frame_msg" v-show="errMsg">{{errMsg}}</text>
		<view class="frame_box" @click.stop>
			<view class="well_number">
				<text>井号:</text>
				<input class="well_inp" type="text" placeholder="请输入井号" v-model="newName" />
			</view>
			<view class="well_password">
				<text>口令:</text>
				<input class="well_inp" type="text" placeholder="请输入口令" v-model="command" />
			</view>
			<text class="frame_btn" @click="frameBtn">提交</text>
		</view>
	</view>
</template>

<script>
	export default {
		props:{
			showBulletFrame:{
				type: Boolean,
				default: false
			},
			goAnalysis:{
				type: Function,
				default: () => {}
			},
			equipment:{
				type: String,
				default: ''
			}
		},
		data() {
			return {
				newName:'',
				command:'',
				errMsg: '',
				errMsgTime: null
			};
		},
		methods:{
			frameBtn(){   
				let _this = this
				_this.$http({
					url: '/wxApi/commandApi/updateWell',
					data:{
						station_id: _this.equipment,
						command: _this.command,
						new_name: _this.newName
					},
					method: 'POST'
				}).then(res => {  
					if(res.code == 200){
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
						this.goAnalysis() 
						// 清空数据
						Object.assign(this.$data,this.$options.data())
					}else{
						_this.errMsg = res.msg
						clearInterval(_this.errMsgTime)
						_this.errMsgTime = setTimeout(() => {
							_this.errMsg =  ''
						},2000)
					}
				}) 
				
			}
		}
	}
</script>

<style lang="less">
.bullet-frame{
	position: fixed;
	top: 0;
	width: 100vw;
	height: 100vh;
	z-index: 10000;
	background-color: rgba(0,0,0,.5);
	.frame_msg{
		position: absolute;
		left: 50%;
		top: 30%;
		font-size: 1.2rem;
		transform: translate(-50%,-50%);
		color: #fff;
	}
	.frame_box{
		position: relative;
		left: 50%;
		top: 50%;
		transform: translate(-50%,-50%);
		width: 80%;
		height: 400rpx;
		background-color: #fff;
		border-radius: 10rpx;
		overflow: hidden;
		.well_number,
		.well_password{ 
			margin: 40rpx 20rpx;
			display: flex;
			justify-content: space-between;
			height: 80rpx;
			line-height: 80rpx; 
			.well_inp{
				padding-left: 20rpx;
				width: 430rpx;
				height: 90%;
				font-size: 28rpx;
				border: 1rpx solid #eee;
			}
		} 
		.frame_btn{
			margin: 0 20rpx;
			position: absolute;
			width: calc(100% - 40rpx);
			bottom: 10rpx;
			height: 70rpx;
			line-height: 70rpx;
			text-align: center;
			color: #fff;
			border-radius: 10rpx;
			background-color: #2596ff;
		}
	}
}
</style>
